<link rel="shortcut  icon" type="image/x-icon" href="img/icon/favicon.ico" media="screen">
<!-- 框架样式 -->
<link type="text/css" rel="stylesheet" href="${static}/fonts/font-icons.min.css">
<link type="text/css" rel="stylesheet" href="${static}/css/bootstrap.min.css">
<link type="text/css" rel="stylesheet" href="${static}/plugin/layui/css/layui.css">
<link type="text/css" rel="stylesheet" href="${static}/plugin/datatable/media/css/dataTables.bootstrap.min.css">
<link type="text/css" rel="stylesheet" href="${static}/plugin/bootstrap-select/css/bootstrap-select.min.css?r=0.020456797551074324">
<link rel="stylesheet" type="text/css" href="${static}/plugin/bootstrap-datetimepicker-master/css/bootstrap-datetimepicker.css">
<link type="text/css" rel="stylesheet" href="${static}/plugin/radioCheckBox/src/pretty.min.css">
<link type="text/css" rel="stylesheet" href="${static}/plugin/materialdesignicons/css/materialdesignicons.min.css">
<link async rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/material-design-iconic-font/2.2.0/css/material-design-iconic-font.min.css"/>
<link type="text/css" rel="stylesheet" href="${static}/plugin/radioCheckBox/src/pretty.min.css">
<link type="text/css" rel="stylesheet" href="${static}/plugin/drag/drag.css">
<link type="text/css" rel="stylesheet" href="${static}/plugin/calendar/simple-calendar.css">
<link type="text/css" rel="stylesheet" href="${static}/plugin/weather/leoweather.css">
<link rel="stylesheet" type="text/css" href="${static}/plugin/imgupload/css/cropper.min.css?r=0.6207188189209538">
<link rel="stylesheet" type="text/css" href="${static}/plugin/imgupload/css/mui.min.css?r=0.9207463414125734">
<link type="text/css" rel="stylesheet" href="${static}/plugin/jquery-plugin-circliful-master/css/jquery.circliful.css">

<!-- 自定义样式 -->
<link type="text/css" rel="stylesheet" href="${static}/css/fream.css"> <!-- 顶部和侧边 -->
<link type="text/css" rel="stylesheet" href="${static}/css/iconfont.css">
<link type="text/css" rel="stylesheet" href="${static}/css/main.css?r=0.4389791385058335">
<link type="text/css" rel="stylesheet" href="${static}/css/nav.css">
<link rel="stylesheet" type="text/css" href="${static}/css/processHelper.css?r=0.07160859914374484">
<link type="text/css" rel="stylesheet" href="${static}/css/dtable.css">
<link type="text/css" rel="stylesheet" href="${static}/page/back/firstpage/css/firstpage.css"><!-- 主页css -->
<link type="text/css" rel="stylesheet" href="${static}/css/btn.css">
<link type="text/css" rel="stylesheet" href="${static}/page/back/device/css/icon.css">

<link type="text/css" rel="stylesheet" href="${static}/page/back/customprint/file/cpTemple.css">
<link type="text/css" rel="stylesheet" href="${static}/js/utils/listRight/listRight.css">
<link type="text/css" rel="stylesheet" href="${static}/plugin/checkBox/dist/checkbox.min.css">
<link type="text/css" rel="stylesheet" href="${static}/page/back/maintainRecord/swiper/swiper.min.css">
<link type="text/css" rel="stylesheet" href="${static}/js/utils/slider/slider.css">
<link type="text/css" rel="stylesheet" href="${static}/plugin/select2-develop/dist/css/select2.min.css">
<link type="text/css" rel="stylesheet" href="${static}/plugin/wdScrollTab/css/TabPanel.css?V4.1-03082101">
<link type="text/css" rel="stylesheet" href="${static}/css/adminlte.min.css">
<link type="text/css" rel="stylesheet" href="${static}/css/common.css">




<script type="text/javascript" src="${static}/js/jquery.min.js"></script>
<script type="text/javascript" src="${static}/js/bootstrap.min.js"></script>
<script type="text/javascript" src="${static}/plugin/layer/layer.js"></script>
<script type="text/javascript" src="${static}/plugin/layui/layui.js"></script>
<script type="text/javascript" src="${static}/plugin/countdown/countdown.js"></script>
<script type="text/javascript" src="${static}/js/i-jquery.js?r=85145"></script>
<script type="text/javascript" src="${static}/js/main.js?v=123"></script>
<script type="text/javascript" src="${static}/js/imgClickBig.js"></script>
<script type="text/javascript" src="${static}/js/jquery.cookie.min.js?v=123456"></script>
<script type="text/javascript" src="${static}/plugin/datatable/media/js/jquery.dataTables.js"></script>
<script type="text/javascript" src="${static}/plugin/datatable/media/js/dataTables.bootstrap.js"></script>
<script type="text/javascript" src="${static}/js/jquery.timeago.js"></script>
<script type="text/javascript" src="${static}/js/jquery.form.js"></script>
<script type="text/javascript" src="${static}/plugin/bootstrap-select/js/bootstrap-select.js"></script>
<script type="text/javascript" src="${static}/plugin/drag/drag.js"></script>
<script type="text/javascript" src="${static}/plugin/calendar/simple-calendar.js"></script>
<script type="text/javascript" src="${static}/plugin/weather/jquery.leoweather.min.js"></script>
<script type="text/javascript" src="${static}/js/material-decomposition.js?r=123sdf"></script>
<script type="text/javascript" src="${static}/js/processHelper.js?r=324242"></script>
<script type="text/javascript" src="${static}/js/checkGroup.js?r=85145"></script>
<script type="text/javascript" src="${static}/js/iDistpicker.js?r=85145"></script>
<script type="text/javascript" src="${static}/plugin/bootstrap-datetimepicker-master/js/bootstrap-datetimepicker.js"></script>
<script type="text/javascript" src="${static}/plugin/bootstrap-datetimepicker-master/js/locales/bootstrap-datetimepicker.zh-CN.js"></script>
<script type="text/javascript" src="${static}/js/pmHelper.js"></script>
<script type="text/javascript" src="${static}/js/formUtil.js"></script>
<script type="text/javascript" src="${static}/js/layer-date-format.js"></script>
<script type="text/javascript" src="${static}/js/dateUtil.js"></script>
<script type="text/javascript" src="${static}/js/iUpload.js"></script>
<script type="text/javascript" src="${static}/plugin/eachrt4.1/echarts.js"></script>
<script type="text/javascript" src="${static}/plugin/jquery-plugin-circliful-master/js/jquery.circliful.js"></script>
<script type="text/javascript" src="${static}/plugin/utils/numberUtils.js"></script>
<script type="text/javascript" src="${static}/js/checkWindowClose.js"></script>
<script type="text/javascript" src="${static}/js/utils/common/fileUtils.js"></script>
<script type="text/javascript" src="${static}/js/utils/common/arrayUtils.js"></script>
<script type="text/javascript" src="${static}/js/utils/common/arrayUtils.js"></script>
<script type="text/javascript" src="${static}/js/utils/common/formUtil.js"></script>
<script type="text/javascript" src="${static}/js/utils/common/layer-tip.js"></script>

<script type="text/javascript" src="${static}/plugin/select2-develop/dist/js/select2.js"></script>
<script type="text/javascript" src="${static}/plugin/select2-develop/dist/js/pinyin.js"></script>

<!-- 生成二维码-->
<script type="text/javascript" src="${static}/plugin/qrcode/jquery.qrcode.js"></script>
<script type="text/javascript" src="${static}/plugin/qrcode/qrcode.js"></script>
<script type="text/javascript" src="${static}/plugin/qrcode/utf.js"></script>
<script type="text/javascript" src="${static}/plugin/JsBarcode-master/dist/JsBarcode.all.js"></script>

<!-- 树插件 -->
<link rel="stylesheet" href="${static}/plugin/ztree/zTreeStyle/zTreeStyle.css" />
<script type="text/javascript" src="${static}/plugin/ztree/jquery.ztree.all-3.5.min.js"></script>
<script type="text/javascript" src="${static}/js/PullDownTreeUtil2.js"></script>
<script src="${static}/plugin/jsPlumb/js/jsplumb.js"></script>
<script src="${static}/plugin/jsPlumb/flowchart-util.js"></script>

<script src="${static}/js/utils/listRight/listRightUtil.js"></script>
<script src="${static}/js/utils/checkUtils/checkUtils.js"></script>
<script src="${static}/page/back/patrolStatic/js/utils.js"></script>
<script src="${static}/js/utils/slider/slider.js"></script>
<script src="${static}/page/back/shuju/js/fullscreen.js"></script>
<script src="${static}/page/back/maintainRecord/swiper/swiper.min.js"></script>

<script  src="${static}/plugin/datatable/JSZip-2.5.0/jszip.min.js"></script>
<script  src="${static}/plugin/datatable/pdfmake-0.1.36/pdfmake.min.js"></script>
<script  src="${static}/plugin/datatable/Buttons-1.5.6/js/dataTables.buttons.js"></script>
<script  src="${static}/plugin/datatable/Buttons-1.5.6/js/buttons.flash.min.js"></script>
<script  src="${static}/plugin/datatable/Buttons-1.5.6/js/buttons.html5.js"></script>
<script  src="${static}/plugin/datatable/Buttons-1.5.6/js/buttons.print.js"></script>
<script  src="${static}/js/utils/table2excel/table2excel.js"></script>
<script  src="${static}/js/common.js"></script>

<link type="text/css" rel="stylesheet" href="${static}/page/back/maintenanceStaff/css/maintenanceStaff.css">
<link type="text/css" rel="stylesheet" href="${static}/page/back/device/css/icon.css">


<style>
    .oper-search{
        margin:5px 10px;
    }
    .iconBtn{
        cursor: pointer;
        transition: all 0.6s;
    }
    .iconBtn:hover{
        transform: scale(1.4);
    }

    .block-normal {
        background-color: #57c4b0;
    }
    .btn-block {
        display: inline-block;
        width: 54px;
        height: 22px!important;
        line-height: 22px!important;
        text-align: center;
        color: #fff;
        font-size: 12px;
    }
    .bg-red {
        background-color: red;
    }
</style>
<body  style="background-color: #EEF1F6;">
<div class="oper-search">
    <form class="form-inline">
        <div class="form-group">
            <label>设备编号：</label>
            <input id="resourceDeviceNo" name ="resourceDeviceNo" type="text" class="form-control search-cache" autocomplete="off"/>
        </div>
        <div class="form-group">
            <label>设备名称：</label>
            <input id="resourceDeviceName" name = "resourceDeviceName" type="text" class="form-control search-cache"  autocomplete="off"/>
        </div>
        <div class="form-group">
            <label>报废日期：</label>
            <input id="scrap_begin_date" name="scrap_begin_date" value="" readonly="" class="scrap_begin_date form-control search-cache" placeholder="请选择开始日期" lay-key="2">
            <input id="scrap_end_date" name="scrap_end_date" value="" readonly="" class="scrap_end_date form-control search-cache" placeholder="请选择结束日期" lay-key="3">
        </div>
        <div class="form-group">
            <span class="btn btn-sm glyphicon glyphicon-search" onclick="searchBtn()">搜索</span>
            <span class="btn btn-sm glyphicon glyphicon-plus"   onclick="add(this);return false;">新增</span>
            <span class="btn btn-sm glyphicon glyphicon-trash btn-del">删除</span>
            <span class="btn btn-sm glyphicon glyphicon-import"  onclick="importExcel()">导入</span>
            <span class="btn btn-sm glyphicon glyphicon-export" onclick="exportPlan()">导出</span>
        </div>
    </form>
</div>

<div class="data-list" style="margin:5px 10px;background-color: white;">
    <table id="table" class="dtable Main_dtable">
        <thead>
        <tr>
            <th style="width: 15px;">
                <div class="pretty success" style="margin: 0;">
                    <input type="checkbox" class="check-all" id="checkAllBtn">
                    <label><i class="mdi mdi-check"></i></label>
                </div>
            </th>
            <th style="min-width: 100px;">设备编号</th>
            <th style="min-width: 100px">设备名称</th>
            <th style="min-width: 60px">状态</th>
            <th style="min-width: 60px">创建人</th>
            <th style="min-width: 60px">创建时间</th>
            <th style="min-width: 60px">修改人</th>
            <th style="min-width: 60px">修改时间</th>
            <th style="min-width: 100px">操作</th>
        </tr>
        </thead>
        <tbody>
        </tbody>
    </table>
</div>


</body>
</html>

<script>
    var dataTable = $(".Main_dtable");
    $(function() {
        /****datatable***************************************************/
        var noticetimeTypeMap = {0:"年",1:"月",2:"天",3:"小时"};
        sys.useSimpleRetrieveData();
        var staticPrefix = "${static}";
        var config = sys.DynamicDatabeConfig(staticPrefix,getSearchUrl(), [
            {
                data: null,
                render: function(data){
                    var html = '<div class="pretty success" style="margin: 0;">'+
                        '<input type="checkbox" data-id="'+data.id+'"> '+
                        '<label><i class="mdi mdi-check"></i></label>'+
                        '</div>';
                    return html;
                }
            },
            {
                data : 'resourceDeviceNo',
            },
            {
                data : 'resourceDeviceName',
                /*render : function(row, type, data, meta) {
                    console.log(row);
                    return data.sex==0?'女':'男';
                }*/
            },
            {
                data: 'status',
                render:function(row, type, data, meta){
                    if(data.status==0){
                        return "<span class='btn-block block-normal'>"+'正常'+"</span>";
                    }else{
                        return "<span class='btn-block bg-red'>"+'停用'+"</span>";
                    }

                }
            },
            {
                data : 'createUser',
            },
            {
                data : 'createTime',
               /* render : function(row, type, data, meta) {
                    if (data.createTime != null) {
                        var crtTime = new Date(data.createTime);
                        return dateFtt("yyyy-MM-dd hh:mm:ss",crtTime);//直接调用公共JS里面的时间类处理的办法 
                    }
                }*/
            },
            {
                data : 'updateUser',
            },
            {
                data : 'updateTime',
                /*render : function(row, type, data, meta) {
                    if (data.updateTime != null) {
                        var crtTime = new Date(data.updateTime);
                        return dateFtt("yyyy-MM-dd hh:mm:ss",crtTime);//直接调用公共JS里面的时间类处理的办法 
                    }
                }*/
            },
            {
                data : null,
                render : function(data) {return getOperHtml(data.id);
                }
            },

        ],true, {ordering:true});
        //禁止排序
        config.bSort=false;
        config.aLengthMenu = [15,25,50,100];
        dataTable.dataTable(config).api().draw();
        /***********日期处理****************************************************/
        layui.use('laydate', function(){
            var laydate = layui.laydate;
            //执行一个laydate实例
            laydate.render({
                elem: '#scrap_begin_date' //指定元素
                ,type: 'datetime'
            });
            laydate.render({
                elem: '#scrap_end_date' //指定元素
                ,type: 'datetime'
            });
        });

    })


    function reload(){
        dataTable.dataTable().api().draw();
    }

    function reload2(){
        dataTable.dataTable().api().draw();
    }

    function getSearchPara() {
        var resourceDeviceNo = $("#resourceDeviceNo").val().trim();
        var resourceDeviceName = $("#resourceDeviceName").val().trim();
        var param = 'resourceDeviceNo='+resourceDeviceNo+'&resourceDeviceName='+resourceDeviceName;
        return param;
    }

    function getSearchUrl(){
        var url = '/devicewcm/deviceData?' + getSearchPara();
        url = encodeURI(url);
        return url;
    }

    function getOperHtml(id){
        var  html = '';
        //html += '<a class="btn btn-brown btn-xs"  onclick="detail('+id+')"><span class="glyphicon glyphicon-list-alt"></span>详情</a>&nbsp;';
        /*html += '<a onclick="edit(this,\''+id+'\');return false;" title="编辑"><i class="fa fa-pencil iconBtn" style="color: rgb(105, 170, 70);"></i></a>&nbsp;&nbsp;&nbsp;';
        html += '<a onclick="edit(this,\''+id+'\');return false;" title="停用"><i class="glyphicon glyphicon-ban-circle iconBtn" style="color: rgb(221, 90, 67)"></i></a>&nbsp;&nbsp;&nbsp;';
        html += '<a onclick="edit(this,\''+id+'\');return false;" title="删除"><i class="fa fa-trash-o iconBtn" style="color: rgb(221, 90, 67)"></i></a>&nbsp;&nbsp;&nbsp;';*/
        html += '<span class="btn btn-xs glyphicon glyphicon-pencil" onclick="edit(this,\''+id+'\');return false;">修改</span>&nbsp;';
        html += '<span class="btn btn-xs glyphicon glyphicon-trash" onclick="del(\''+id+'\');return false;" >删除</span>';
        return html;
    }

    function searchBtn(){
        dataTable.api().ajax.url(getSearchUrl()).load(null, false).draw();
    }

    function add(obj) {
        var $this = $(obj);
        var url = "/devicewcm/add";
        js.addTabPage($this,'新增设备',url,true,true);
    }

    function edit(obj,id) {
        var $this = $(obj);
        var url = "/devicewcm/edit?id="+id;
        js.addTabPage($this,'修改设备',url,true,true);
    }

    function del(id) {
        sys.confirm("确定删除该数据吗？", confirmdel);
        function confirmdel() {
            $.ajax({
                url : "delete",
                type : "POST",
                datatype : "json",
                data : {
                    "id" : id,
                },
                success : function(data, stats) {
                    if (data.success) {
                        js.showMessage(data.data,"","success",1500)
                        dataTable.dataTable().api().draw();
                    } else {
                        js.showMessage("删除失败","","error",1500)
                    }
                },
                error : function(data) {
                    js.showMessage("删除失败","","error",1500)
                }
            });
        }
    }

    function delBatch(ids) {
        sys.confirm("确定删除选中数据吗？", confirmdel);
        function confirmdel() {
            $.ajax({
                url : "delBatch",
                type : "POST",
                datatype : "json",
                data : {
                    "ids" : ids,
                },
                success : function(data, stats) {
                    if (data.success) {
                        $(".check-all").attr("checked", false);
                        js.showMessage(data.data,"","success",1500)
                        //dataTable.dataTable().api().draw();
                        dataTable.dataTable().api().ajax.reload(null,false);
                        //dataTable.DataTable().ajax.url(getSearchUrl()).load(null, false);
                    } else {
                        js.showMessage("删除失败","","error",1500)
                    }
                },
                error : function(data) {
                    js.showMessage("删除失败","","error",1500)
                }
            });
        }
    }
    /*全选*/
    $("#table").on("click", "[type='checkbox']", function(e){
        e.stopPropagation();
        var jqCheck = $(this);
        if(jqCheck.hasClass("check-all")){
            $(document.body).find("[type='checkbox']:not(.check-all)").each(function(){
                this.checked = jqCheck[0].checked;
            })
        }else {
            var allChecked = true;
            $(document.body).find("[type='checkbox']:not(.check-all)").each(function(){
                if(!this.checked){
                    allChecked = false;
                }
            });
            $(document.body).find(".check-all")[0].checked = allChecked;
        }
    });

    /*多条删除*/
   $(document.body).find(".btn-del").on("click", function(){
        var chks = $(document.body).find("[type='checkbox']:not(.check-all):checked");

        if(chks && chks.length){
            var ids = "";
            for(var i = 0; i < chks.length; i++){
                if(ids.length > 0){
                    ids += ",";
                }
                ids += chks.eq(i).data("id");
            }
            delBatch(ids);
        }else {
            //sys.topmsg("请勾选要删除的数据");
            js.showMessage("请勾选要删除的数据！",null,"warning",1500);
            return;
        }
    });
</script>